<template>
  <div class="container-content">
    <el-form
      ref="elForm"
      :model="formData"
      :rules="rules"
      size="medium"
      label-width="100px"
    >
      <!-- <el-form-item label="编码" prop="contactsCode">
        <el-input
          v-model="formData.contactsCode"
          placeholder="请输入编码"
          clearable
          :style="{ width: '100%' }"
        >
        </el-input>
      </el-form-item> -->
      <el-form-item label="姓名" prop="name">
        <el-input
          v-model="formData.name"
          placeholder="请输入姓名"
          clearable
          :style="{ width: '100%' }"
        ></el-input>
      </el-form-item>
      <el-form-item label="职务" prop="position">
        <el-input
          v-model="formData.position"
          placeholder="请输入职务"
          clearable
          :style="{ width: '100%' }"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="性别" prop="sex">
        <el-select
          v-model="formData.sex"
          placeholder="请选择性别"
          clearable
          :style="{ width: '100%' }"
        >
          <el-option
            v-for="(item, index) in sexOptions"
            :key="index"
            :label="item.label"
            :value="item.value"
            :disabled="item.disabled"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="传真" prop="fax">
        <el-input
          v-model="formData.fax"
          placeholder="请输入传真"
          clearable
          :style="{ width: '100%' }"
        ></el-input>
      </el-form-item>

      <el-form-item label="创建人" prop="userId">
        <el-input
          v-model="formData.userId"
          placeholder="请输入创建人"
          clearable
          :style="{ width: '100%' }"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="所属公司" prop="belongCompany">
        <el-input
          v-model="formData.belongCompany"
          placeholder="请输入所属公司"
          clearable
          :style="{ width: '100%' }"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="移动电话" prop="mobile">
        <el-input
          v-model="formData.mobile"
          placeholder="请输入移动电话"
          clearable
          :style="{ width: '100%' }"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="邮件地址" prop="email">
        <el-input
          v-model="formData.email"
          placeholder="请输入邮件地址"
          clearable
          :style="{ width: '100%' }"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="地点名称" prop="addressName">
        <el-input
          v-model="formData.addressName"
          placeholder="请输入地点名称"
          clearable
          :style="{ width: '100%' }"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="地点编码" prop="addressCode">
        <el-input
          v-model="formData.addressCode"
          placeholder="请输入地点编码"
          clearable
          :style="{ width: '100%' }"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="详细地址" prop="address">
        <el-input
          v-model="formData.address"
          placeholder="请输入详细地址"
          clearable
          :style="{ width: '100%' }"
        >
        </el-input>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { add } from "@/api/base/data";
import { updataKingBaseContactsList,editKingBaseContactsList } from "@/api/bim/outher";
export default {
  components: {},
   props: ["id"],
  data() {
    return {
      flag:false,
      formData: {
        address: "",
        addressCode: "",
        addressName: "",
        belongCompany: "",
        changeTime: "",
        contactsCode: "",
        createTime: "",
        email: "",
        fax: "",
        id: "",

        mobile: "",
        name: "",
        position: "",
        sex: "",
        type: "",
        userId: "",
        workTel: "",
      },
      rules: {
        contactsCode: [
          {
            required: true,
            message: "请输入编码",
            trigger: "blur",
          },
        ],
        name: [
          {
            required: true,
            message: "请输入姓名",
            trigger: "blur",
          },
        ],
        position: [
          {
            required: true,
            message: "请输入职务",
            trigger: "blur",
          },
        ],
        sex: [
          {
            required: true,
            message: "请选择性别",
            trigger: "change",
          },
        ],
        fax: [
          {
            required: true,
            message: "请输入传真",
            trigger: "blur",
          },
        ],
        supplierId: [
          {
            required: true,
            message: "请输入供应商",
            trigger: "blur",
          },
        ],
        userId: [
          {
            required: true,
            message: "请输入创建人",
            trigger: "blur",
          },
        ],
        belongCompany: [
          {
            required: true,
            message: "请输入所属公司",
            trigger: "blur",
          },
        ],
        mobile: [
          {
            required: true,
            message: "请输入移动电话",
            trigger: "blur",
          },
          {
            pattern:
              /^1\d{10}$|^(0\d{2,3}-?|\(0\d{2,3}\))?[1-9]\d{4,7}(-\d{1,8})?$/,
            message: "请输入正确的手机号码！",
            trigger: "blur",
          },
        ],
        email: [
          {
            required: true,
            message: "请输入邮件地址",
            trigger: "blur",
          },
        ],
        addressName: [
          {
            required: true,
            message: "请输入地点名称",
            trigger: "blur",
          },
        ],
        addressCode: [
          {
            required: true,
            message: "请输入地点编码",
            trigger: "blur",
          },
        ],
        address: [
          {
            required: true,
            message: "请输入详细地址",
            trigger: "blur",
          },
        ],
      },
      sexOptions: [
        {
          label: "男",
          value: 0,
        },
        {
          label: "女",
          value: 1,
        },
        {
          label: "未知",
          value: 2,
        },
      ],
    };
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
    if (this.id!='') {
      updataKingBaseContactsList(this.id).then(res=>{
        this.formData=res.data
        this.flag=true
      })
    }
  },
  methods: {
    submitForm(cb) {
    if (this.flag) {
        this.$refs["elForm"].validate((valid) => {
        if (!valid) return;
        // TODO 提交表单
        editKingBaseContactsList(this.formData, "KingBaseContacts").then((res) => {
          if (res.code === 200) {
            cb();
            this.$message.success("修改成功");
            this.flag=false
          }
        });
      });
    }else{
        this.$refs["elForm"].validate((valid) => {
        if (!valid) return;
        // TODO 提交表单
        add(this.formData, "KingBaseContacts").then((res) => {
          if (res.code === 200) {
            cb();
            this.$message.success("新增成功");
          }
        });
      });
    }
    },
    resetForm() {
      this.$refs["elForm"].resetFields();
    },
  },
};
</script>
<style></style>
